<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增-表与rpc接口映射关系')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal" id="form-table-add">
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">数据库地址：</label>
            <div class="col-sm-8">
                <input name="url" class="form-control" type="text" required>
                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i>提示：如，jdbc:mysql://localhost:3306/test?useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8&useSSL=false</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">用户名：</label>
            <div class="col-sm-8">
                <input name="username" class="form-control" type="text">
                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i>提示：数据库连接需要的用户名</span>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">密码：</label>
            <div class="col-sm-8">
                <input name="password" class="form-control" type="text">
                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i>提示：数据库连接需要的密码</span>
            </div>
        </div>
        <dev style="position: relative;float: right;margin: 10px;">
            <a class="btn btn-primary btn-rounded btn-sm" onclick="connectAndGetTableList()"><i class="fa fa-download"></i> 连接数据库并获取表信息</a>
        </dev>
    </form>
    <div class="col-sm-12 select-table table-striped">
				<span class="help-block m-b-none"><i class="fa fa-info-circle"></i>【选择表】
            该方式是基于表，前提是事先在数据库创建好表，会生成controller层，service层、DAO层、实体类、mapper.xml文件及前端html文件<br>
            主要用于当前功能涉及本地表</span>
        <table id="bootstrap-table"></table>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: bootstrap-table-export-js"/>
<script th:src="@{/ajax/libs/highlight/highlight.min.js}"></script>
<script th:inline="javascript">
    var prefix = ctx + "tool/gen";

    var options = {
        url: prefix + "/customizedb/list",
        sortName: "createTime",
        sortOrder: "desc",
        showSearch: false,
        showRefresh: false,
        showToggle: false,
        showColumns: false,
        clickToSelect: true,
        rememberSelected: true,
        uniqueId: "tableName",
        columns: [{
            field: 'state',
            checkbox: true
        },
            {
                title: "序号",
                formatter: function (value, row, index) {
                    return $.table.serialNumber(index);
                }
            },
            {
                field: 'tableName',
                title: '表名称',
                sortable: true,
                formatter: function (value, row, index) {
                    return $.table.tooltip(value);
                }
            },
            {
                field: 'tableComment',
                title: '表描述',
                sortable: true,
                formatter: function (value, row, index) {
                    return $.table.tooltip(value);
                }
            },
            {
                field: 'createTime',
                title: '创建时间',
                sortable: true
            },
            {
                field: 'updateTime',
                title: '更新时间',
                sortable: true
            }]
    };

    $("#form-table-add").validate({
    	focusCleanup: true
    });
    function connectAndGetTableList() {
        if ($.validate.form()) {
            $.table.init(options);
        }
    }
    function submitHandler() {
        var rows = $.table.selectColumns("tableName");
        if (rows.length == 0) {
            $.modal.alertWarning("请至少选择一条记录");
            return;
        }
        // var data = {"tables": rows.join(),"config":$('#form-table-add').serialize()};
        // data = getFromInputValue(document.getElementById("form-table-add"),data);
        // $.operate.post(prefix + "/importCustomizeTable", data,function(result){
        //     console.log(result)
        // });
        // window.open(prefix + "/importCustomizeTable?tables=" +  rows.join()+"&"+$('#form-table-add').serialize())
        location.href = prefix + "/importCustomizeTable?tables=" +  rows.join()+"&"+$('#form-table-add').serialize();
    }
    function getFromInputValue(form,p) {
        var inputArr = form.getElementsByTagName("input");
        for(var i=0;i<inputArr.length;i++){
            p[inputArr[i].name] = inputArr[i].value;
        }
        return p;
    }
</script>
</body>
</html>